import React, { Component } from "react";
import "./App.css";

import { HashRouter as Router, Route, Link, NavLink } from "react-router-dom";

const Home = () => <h2>Home组件</h2>;
const About = () => <h2>About组件</h2>;

export default class App extends Component {
  render() {
    return (
      <Router>
        <h2>Link</h2>
        <ul>
          <li>
            <Link to="/home">home</Link>
          </li>
          <li>
            <Link to="/about">about</Link>
          </li>
        </ul>
        <hr />
        <h2>NavLink</h2>
        <ul>
          <li>
            <NavLink to="/home">home</NavLink>
          </li>
          <li>
            <NavLink to="/about">about</NavLink>
          </li>
        </ul>

        <Route path="/home" component={Home}></Route>
        <Route path="/about" component={About}></Route>
      </Router>
    );
  }
}
